@extends('layouts.default')
@section('main')
    <link rel="stylesheet" href="/css/uniform.css" />
    <link rel="stylesheet" href="/css/select2.css" />

    <script type="text/javascript" src="{{URL::asset('js/')}}/jquery-1.8.3.min.js"></script>
    <script type="text/javascript" src="{{URL::asset('js/')}}/hightcharts/highcharts.js"></script>
    <script src="{{URL::asset('js/My97DatePicker/')}}/WdatePicker.js"></script>

    <script>
        //初始函数，设置定时器，定时取数据
        $(function () {
            queryDayRegData();
        });

        //图表属性，不包含数据
        var dayRegOptions = {
            chart: {
                renderTo:'dayRegCon',
                type:'spline'
            },
            title: {
                text: '会员日注册数据统计',
                x: -20 //center
            },
            xAxis:{

            },
            yAxis: {
                title: {
                    text: '日注册次数'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            series: [{
                name: '总数'
            }, {
                name: 'web'
            }, {
                name: '投融1.0导入'
            }, {
                name: '微信'
            }, {
                name: '后台添加'
            }, {
                name: '内部注册'
            }, {
                name: '经纪人代发'
            }, {
                name: '重庆自动注册'
            }, {
                name: '安卓'
            }, {
                name: 'ios'
            }],
            tooltip: {
                crosshairs: [{
                    width: 3,
                    color: 'green'
                }, {
                    width: 3,
                    color: 'green'
                }],


                valueSuffix: '次'
            },
            credits:{
                // enabled:true,                    // 默认值，如果想去掉版权信息，设置为false即可
                text:'无界投融',               // 显示的文字
                href:'',   // 链接地址
                position:{                          // 位置设置
                    align: 'left',
                    x: 1050,
                    verticalAlign: 'bottom',
                    y: -30
                },
                style: {                            // 样式设置
                    cursor: 'pointer',
                    color: 'blue',
                    fontSize: '10px'
                }
            },
            plotOptions: {
                spline:{
                    dataLabels: {
                        enabled: true
                    },
                    animation:false
                }
            }
        };

        var weekRegOptions = {
            chart: {
                renderTo:'weekRegCon',
                type:'spline'
            },
            title: {
                text: '会员周注册数据统计（工作周）',
                x: -20 //center
            },
            xAxis:{

            },
            yAxis: {
                title: {
                    text: '周注册次数'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            series: [{
                name: '总数'
            }, {
                name: 'web'
            }, {
                name: '投融1.0导入'
            }, {
                name: '微信'
            }, {
                name: '后台添加'
            }, {
                name: '内部注册'
            }, {
                name: '经纪人代发'
            }, {
                name: '重庆自动注册'
            }, {
                name: '安卓'
            }, {
                name: 'ios'
            }],
            tooltip: {
                valueSuffix: '次'
            },
            credits:{
                // enabled:true,                    // 默认值，如果想去掉版权信息，设置为false即可
                text:'无界投融',               // 显示的文字
                href:'',   // 链接地址
                position:{                          // 位置设置
                    align: 'left',
                    x: 1050,
                    verticalAlign: 'bottom',
                    y: -30
                },
                style: {                            // 样式设置
                    cursor: 'pointer',
                    color: 'blue',
                    fontSize: '10px'
                }
            },
            plotOptions: {
                spline:{
                    dataLabels: {
                        enabled: true
                    },
                    animation:false
                }
            }
        };

        var monthRegOptions = {
            chart: {
                renderTo:'monthRegCon',
                type:'spline'
            },
            title: {
                text: '会员月注册数据统计',
                x: -20 //center
            },
            xAxis:{

            },
            yAxis: {
                title: {
                    text: '月注册次数'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            series: [{
                name: '总数'
            }, {
                name: 'web'
            }, {
                name: '投融1.0导入'
            }, {
                name: '微信'
            }, {
                name: '后台添加'
            }, {
                name: '内部注册'
            }, {
                name: '经纪人代发'
            }, {
                name: '重庆自动注册'
            }, {
                name: '安卓'
            }, {
                name: 'ios'
            }],
            tooltip: {
                valueSuffix: '次'
            },
            credits:{
                // enabled:true,                    // 默认值，如果想去掉版权信息，设置为false即可
                text:'无界投融',               // 显示的文字
                href:'',   // 链接地址
                position:{                          // 位置设置
                    align: 'left',
                    x: 1050,
                    verticalAlign: 'bottom',
                    y: -30
                },
                style: {                            // 样式设置
                    cursor: 'pointer',
                    color: 'blue',
                    fontSize: '10px'
                }
            },
            plotOptions: {
                spline:{
                    dataLabels: {
                        enabled: true
                    },
                    animation:false
                }
            }
        };


        var dayRegCategories = [];
        var dayRegTotalDatas = [];
        var dayRegWebDatas = [];
        var dayRegTrdrDatas = [];
        var dayRegWeixinDatas = [];
        var dayRegHttjDatas = [];
        var dayRegNbzcDatas = [];
        var dayRegAgencyDatas = [];
        var dayRegCqzcDatas = [];
        var dayRegAdDatas = [];
        var dayRegIosDatas = [];

        var weekRegCategories = [];
        var weekRegTotalDatas = [];
        var weekRegWebDatas = [];
        var weekRegTrdrDatas = [];
        var weekRegWeixinDatas = [];
        var weekRegHttjDatas = [];
        var weekRegNbzcDatas = [];
        var weekRegAgencyDatas = [];
        var weekRegCqzcDatas = [];
        var weekRegAdDatas = [];
        var weekRegIosDatas = [];

        var monthRegCategories = [];
        var monthRegTotalDatas = [];
        var monthRegWebDatas = [];
        var monthRegTrdrDatas = [];
        var monthRegWeixinDatas = [];
        var monthRegHttjDatas = [];
        var monthRegNbzcDatas = [];
        var monthRegAgencyDatas = [];
        var monthRegCqzcDatas = [];
        var monthRegAdDatas = [];
        var monthRegIosDatas = [];


        //Ajax 获取数据并解析创建Highcharts图表
        function queryDayRegData() {
            $.ajax({
                url:'/userstatistic/user-day-reg',
                dataType:"json",
                success:function(data) {
                    $.each(data,function(i,n){
                        dayRegCategories[i] = n[0];
                        for(var j in n[1]){

                            if(j=='total'){
                                dayRegTotalDatas[i] = n[1][j]*1;
                            }
                            if(j=='web'){
                                dayRegWebDatas[i] = n[1][j]*1;
                            }

                            if(j=='trdr'){
                                dayRegTrdrDatas[i] = n[1][j]*1;
                            }

                            if(j=='weixin'){
                                dayRegWeixinDatas[i] = n[1][j]*1;
                            }

                            if(j=='weixin'){
                                dayRegWeixinDatas[i] = n[1][j]*1;
                            }

                            if(j=='httj'){
                                dayRegHttjDatas[i] = n[1][j]*1;
                            }

                            if(j=='nbzc'){
                                dayRegNbzcDatas[i] = n[1][j]*1;
                            }

                            if(j=='agency'){
                                dayRegAgencyDatas[i] = n[1][j]*1;
                            }

                            if(j=='cqzc'){
                                dayRegCqzcDatas[i] = n[1][j]*1;
                            }

                            if(j=='android'){
                                dayRegAdDatas[i] = n[1][j]*1;
                            }

                            if(j=='ios'){
                                dayRegIosDatas[i] = n[1][j]*1;
                            }


                        }
                    });
                    dayRegOptions.xAxis.categories = dayRegCategories;
                    dayRegOptions.series[0].data = dayRegTotalDatas;
                    dayRegOptions.series[1].data = dayRegWebDatas;
                    dayRegOptions.series[2].data = dayRegTrdrDatas;
                    dayRegOptions.series[3].data = dayRegWeixinDatas;
                    dayRegOptions.series[4].data = dayRegHttjDatas;
                    dayRegOptions.series[5].data = dayRegNbzcDatas;
                    dayRegOptions.series[6].data = dayRegAgencyDatas;
                    dayRegOptions.series[7].data = dayRegCqzcDatas;
                    dayRegOptions.series[8].data = dayRegAdDatas;
                    dayRegOptions.series[9].data = dayRegIosDatas;
                    chart = new Highcharts.Chart(dayRegOptions);
                }
            });

            $.ajax({
                url:'/userstatistic/user-week-reg',
                dataType:"json",
                success:function(data) {
                    $.each(data,function(i,n){
                        weekRegCategories[i] = n[0];
                        for(var j in n[1]){

                            if(j=='total'){
                                weekRegTotalDatas[i] = n[1][j]*1;
                            }
                            if(j=='web'){
                                weekRegWebDatas[i] = n[1][j]*1;
                            }

                            if(j=='trdr'){
                                weekRegTrdrDatas[i] = n[1][j]*1;
                            }

                            if(j=='weixin'){
                                weekRegWeixinDatas[i] = n[1][j]*1;
                            }

                            if(j=='weixin'){
                                weekRegWeixinDatas[i] = n[1][j]*1;
                            }

                            if(j=='httj'){
                                weekRegHttjDatas[i] = n[1][j]*1;
                            }

                            if(j=='nbzc'){
                                weekRegNbzcDatas[i] = n[1][j]*1;
                            }

                            if(j=='agency'){
                                weekRegAgencyDatas[i] = n[1][j]*1;
                            }

                            if(j=='cqzc'){
                                weekRegCqzcDatas[i] = n[1][j]*1;
                            }

                            if(j=='android'){
                                weekRegAdDatas[i] = n[1][j]*1;
                            }

                            if(j=='ios'){
                                weekRegIosDatas[i] = n[1][j]*1;
                            }


                        }
                    });
                    weekRegOptions.xAxis.categories = weekRegCategories;
                    weekRegOptions.series[0].data = weekRegTotalDatas;
                    weekRegOptions.series[1].data = weekRegWebDatas;
                    weekRegOptions.series[2].data = weekRegTrdrDatas;
                    weekRegOptions.series[3].data = weekRegWeixinDatas;
                    weekRegOptions.series[4].data = weekRegHttjDatas;
                    weekRegOptions.series[5].data = weekRegNbzcDatas;
                    weekRegOptions.series[6].data = weekRegAgencyDatas;
                    weekRegOptions.series[7].data = weekRegCqzcDatas;
                    weekRegOptions.series[8].data = weekRegAdDatas;
                    weekRegOptions.series[9].data = weekRegIosDatas;
                    chart = new Highcharts.Chart(weekRegOptions);
                }
            });

            $.ajax({
                url:'/userstatistic/user-month-reg',
                dataType:"json",
                success:function(data) {
                    $.each(data,function(i,n){
                        monthRegCategories[i] = n[0];
                        for(var j in n[1]){

                            if(j=='total'){
                                monthRegTotalDatas[i] = n[1][j]*1;
                            }
                            if(j=='web'){
                                monthRegWebDatas[i] = n[1][j]*1;
                            }

                            if(j=='trdr'){
                                monthRegTrdrDatas[i] = n[1][j]*1;
                            }

                            if(j=='weixin'){
                                monthRegWeixinDatas[i] = n[1][j]*1;
                            }

                            if(j=='weixin'){
                                monthRegWeixinDatas[i] = n[1][j]*1;
                            }

                            if(j=='httj'){
                                monthRegHttjDatas[i] = n[1][j]*1;
                            }

                            if(j=='nbzc'){
                                monthRegNbzcDatas[i] = n[1][j]*1;
                            }

                            if(j=='agency'){
                                weekRegAgencyDatas[i] = n[1][j]*1;
                            }

                            if(j=='cqzc'){
                                monthRegCqzcDatas[i] = n[1][j]*1;
                            }

                            if(j=='android'){
                                monthRegAdDatas[i] = n[1][j]*1;
                            }

                            if(j=='ios'){
                                monthRegIosDatas[i] = n[1][j]*1;
                            }


                        }
                    });
                    monthRegOptions.xAxis.categories = monthRegCategories;
                    monthRegOptions.series[0].data = monthRegTotalDatas;
                    monthRegOptions.series[1].data = monthRegWebDatas;
                    monthRegOptions.series[2].data = monthRegTrdrDatas;
                    monthRegOptions.series[3].data = monthRegWeixinDatas;
                    monthRegOptions.series[4].data = monthRegHttjDatas;
                    monthRegOptions.series[5].data = monthRegNbzcDatas;
                    monthRegOptions.series[6].data = monthRegAgencyDatas;
                    monthRegOptions.series[7].data = monthRegCqzcDatas;
                    monthRegOptions.series[8].data = monthRegAdDatas;
                    monthRegOptions.series[9].data = monthRegIosDatas;
                    chart = new Highcharts.Chart(monthRegOptions);
                }
            });





        }

    </script>
    <div id="content">
        <div id="content-header">
            <div id="breadcrumb">
                <a href="{{url('home')}}" title="返回首页" class="tip-bottom"><i class="icon-home"></i> 首页</a>
            </div>
        </div>
        <div class="container-fluid">
            <div class="widget-title">
                <ul class="nav nav-tabs">
                    <li class="active"><a data-toggle="tab" href="#tab1">注册数</a></li>

                </ul>
            </div>

            <div class="widget-content tab-content">
                <div id="tab1" class="tab-pane active">
                    <div>
                        <p>
                            <button class="btn tip-top" id="dayReg">日</button>
                            <button class="btn tip-left" id="weekReg">周</button>
                            <button class="btn tip-right" id="monthReg">月</button>
                        </p>
                        <div id="dayRegCon" style="width: 1100px; height: 400px; margin: 0 "></div>
                        <div id="weekRegCon" style="width: 1100px; height: 400px; margin: 0; display: none; "></div>
                        <div id="monthRegCon" style="width: 1100px; height: 400px; margin: 0; display: none; "></div>
                    </div>
                </div>


            </div>
        </div>


    </div>
    <script src="/js/matrix.tables.js"></script>
    <script type="text/javascript" src="{{URL::asset('js/')}}/common.js"></script>
    <script>
        $("#dayReg").click(function(){
            $("#dayRegCon").show();
            $("#weekRegCon").hide();
            $("#monthRegCon").hide();
        });

        $("#weekReg").click(function(){
            $("#dayRegCon").hide();
            $("#weekRegCon").show();
            $("#monthRegCon").hide();
        });

        $("#monthReg").click(function(){
            $("#dayRegCon").hide();
            $("#weekRegCon").hide();
            $("#monthRegCon").show();
        });


    </script>

@stop
